<template>
  <div class="container dd">
    <Header>
      足迹
    </Header>
    <div class="search">
      <input type="text" placeholder="请输入搜索内容">
      <span>
        <i class="iconfont icon-sousuo"></i>
        <span>搜索</span>
      </span>
    </div>
    <Prolist :prolist="prolist" />
  </div>
</template>
<script>
import Prolist from '@/components/Prolist.vue'
import axios from '@/utils/request'
import Header from '@/components/header.vue'
export default {
  components: {
    Prolist,
    Header
  },
  data () {
    return {
      prolist: []
    }
  },
  created () {
    axios.get('/pro').then(res => {
      if (res.data.code !== '200') {
        this.$router.push('/login')
      } else {
        console.log(res.data)
        this.prolist = res.data.data
      }
    })
  },
  methods: {
    back () {
      this.$router.back()
    }
  }
}
</script>
<style lang="scss">
@import '@/lib/reset.scss';
.dd {
  @include background-color(#f3f3f3);
  header {
    @include flexbox();
    @include justify-content(space-between);
  }
  .search {
    @include rect(100%, auto);
    @include background-color(#fff);
    @include padding(.1rem .15rem);
    @include flexbox();
    @include align-items();
    input {
      @include rect(2.5rem, .3rem);
      @include border-radius(.08rem);
      @include background-color(#f0f0f0);
      @include padding(0 .1rem);
      @include margin(0 .2rem 0 0);
      border: none;
    }
    span {
      @include font-size(.2rem);
      @include flexbox();
      @include align-items();
      i {
        @include font-size(.3rem);
        @include margin(0 .05rem 0 0);
      }
    }
  }
}
</style>
